<template>
	<view class="uni_box home">
		<!-- <navbar title='安全中心' :yin="false">
		</navbar> -->
		<view class="lone">
			<image class="lfan" src="/static/img/icon_back.png" @click="getfan"/>
			<!-- <text class="Loginname">欢迎登录平台</text> -->
		</view>
		<view class="content">
			<view class="logoview">
				<image class="logologin" src="/static/img/logologin.png"/>
			</view>
			<view class="sbotview">
				<view class="tologin btn" @click="getlogin">微信用户快速登录</view>
				<view class="tologin" @click="getfan">取消登录</view>
			</view>

			<view class="yandeng">
				<view class="yinview">
					<image class="yueicon" src="/static/img/icon_xz_s.png"/>
					<text class="yuedu">已阅读并同意《***服务协议》及《隐私政策》</text>
				</view>
			</view>
			

			
		</view>

		<u-select v-model="bshow" :list="blist" @confirm="bconfirm"></u-select>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value:'',
				wang:'',
				bshow:false,
				blist:[
					{
						value: '1',
						label: '江'
					},
					{
						value: '2',
						label: '湖'
					}
				],
				email:'111@qq.com',
				password:'1234567891',
				isyan:false,
				code:''
			}
		},
		onLoad() {
			
		},
		onShow() {
		},
		methods: {
			async getlogin(){
				if(!this.email){
					this.$u.toast('请输入邮箱');
					return false
				}
				if(!this.password){
					this.$u.toast('请输入密码');
					return false
				}
				let res = await this.$u.api.login({
					email:this.email,
					password:this.password
				});
				console.log(res)
				this.$store.commit('changeToken', res.token);
				// this.$store.commit('changeJiaose', data.jiaose);
				this.$u.toast('登录成功');
				setTimeout(() => {
					uni.switchTab({
						url: '/pages/tabbar/Tabhome'
					})
				}, 1000);
			},
			xuanwang(){
				this.bshow = true
			},
			bconfirm(e){
				console.log(e)
				this.wang = e[0].value
			},
			wangji(){
				this.navrouter("/pages/login/ForgetPsd");
			},
			zhuce(){
				this.navrouter("/pages/login/register");
			},
			
			getfan(){
				uni.navigateBack()
			},
			yanClick(){
				this.isyan = !this.isyan
			}

		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: #fff;
	}
	.lone{
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 40rpx;
		// #ifdef APP-PLUS
		padding-top: calc(var(--status-bar-height) + 40rpx);;
		// #endif
		.lfan{
			width: 40rpx;
			height: 40rpx;
			margin-right: 20rpx;

		}
		.Loginname{
			font-family: Source Han Sans CN;
			font-weight: bold;
			font-size: 40rpx;
			color: #000000;
		}
	}
	.logoview{
		position: relative;
		display: flex;
		flex-direction: column;
		margin-bottom: 120rpx;
		.loginname{
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 62rpx;
			color: #333333;
		}
		.loginmiao{
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 32rpx;
			color: #666666;
			margin-top: 15rpx;
			display: block;
		}
		.loview{
			position: absolute;
			width: 100%;
			height: 100%;
			border-radius: 40rpx;
			display: block;
			
		}
	}
	.logoview{
		display: flex;
		align-items: center;
		justify-content: center;

		.logologin{
			width: 242rpx;
			height: 309rpx;
		}
	}
	.chongji{
		width: 38rpx;
		height: 36rpx;
	}
	.content{
		background-color: #fff;
		padding: 30rpx 60rpx;
		min-height: 88vh;
		display: flex;
		flex-direction: column;
		.mpone{
			display: flex;
			flex-direction: row;
			align-items: center;
			margin-bottom: 80rpx;
			.touview{
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
				margin-right: 30rpx;
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;
			}
			.tou2{
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
				position: absolute;
			}
			.xj{
				position: relative;
				z-index: 1;
				width: 42rpx;
				height: 38rpx;
			}
			.mpright{
				flex: 1;
				display: flex;
				flex-direction: column;
				.yxname{
					font-family: Source Han Sans CN;
					font-weight: bold;
					font-size: 24rpx;
					color: #000000;
				}
				.to lo g i nview{
					display: flex;
					flex-direction: row;
					align-items: center;
					margin-top: 10rpx;
					.idnum{
						font-family: Source Han Sans CN;
						font-weight: 400;
						font-size: 24rpx;
						color: #000000;
						display: inline-block;
						margin-right: 13rpx;
					}
					.dengji{
						padding: 5rpx 30rpx;
						background: #FF8004;
						border-radius: 14rpx;
						font-family: Source Han Sans CN;
						font-weight: 400;
						font-size: 20rpx;
						color: #FFFFFF;
					}
				}
			}
		}
		.qian{
			display: flex;
			flex-direction: row;
			align-items: center;
			margin-bottom: 45rpx;
			.qbiao{
				display: inline-block;
				width: 8rpx;
				height: 36rpx;
				background: #FF8004;
				margin-right: 8rpx;

			}
			.qname{
				font-family: Source Han Sans CN;
				font-weight: bold;
				font-size: 30rpx;
				color: #000000;
			}
		}
		.uone{
			display: flex;
			flex-direction: column;
			margin-bottom: 40rpx;
			.Input-head{
				display: flex;
				flex-direction: row;
				align-items: center;

			}
			.usdt{
				width: 46rpx;
				height: 46rpx;
				margin-right: 12rpx;
			}
			.Input-label{
				font-family: Source Han Sans CN;
				font-weight: 500;
				font-size: 30rpx;
				color: #000000;
				display: inline-block;
				margin-left: 20rpx;
			}
		}
		// .uone:last-child{
		// 	margin-bottom: 30rpx;
		// }
		.Forgot-password{
			font-family: PingFang SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #999999;
		}
		.ushuru{
			padding: 20rpx 30rpx;
			background: #F7F7F7;
			border-radius: 20rpx;
			// margin-top: 20rpx;
			display: flex;
			align-items: center;
			flex-direction: row;
			min-height: 80rpx;
			/deep/.u-input__input{
				font-weight: 400;
				font-size: 32rpx;
				color: #000000;
			}
			.xuantit{
				color: #c0c4cc;
			}
			.xactive{
				font-weight: 400;
				font-size: 28rpx;
				color: #000000;
			}
			.xia{
				margin-left: auto;
				width: 16rpx;
				height: 10rpx;
			}
			.quanbu{
				margin-left: 30rpx;
				display: flex;
				flex-direction: row;
				align-items: center;
				font-family: Source Han Sans CN;
				font-weight: 400;
				font-size: 28rpx;
				color: #010101;
			}
			.huoqu{
				padding: 8rpx 0rpx;
				margin-left: 10rpx;
				font-weight: 500;
				font-size: 30rpx;
				color: #496EE7;
			}
		}
		.keyong{
			display: block;
			text-align: right;
			font-family: Source Han Sans CN;
			font-weight: 400;
			font-size: 22rpx;
			color: #010101;
			margin-bottom: 75rpx;
		}
		
		.sbotview{
			margin: 40rpx 0 40rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			.shoufei{
				font-family: Source Han Sans CN;
				font-weight: 400;
				font-size: 22rpx;
				color: #010101;
				display: block;
				margin-bottom: 15rpx;


			}
			.tologin{
				width: 100%;
				height: 96rpx;
				background: #CCCCCC;
				border-radius: 20rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-weight: 500;
				font-size: 32rpx;
				color: #fff;
				margin-bottom: 32rpx;
			}
			.btn{
				background: #06C15F;
				color: #fff;
			}
			.No-account{
				display: block;
				text-align: center;
				font-family: Source Han Sans CN;
				font-weight: 500;
				font-size: 26rpx;
				color: #A5A5A5;
				margin-top: 40rpx;
			}
			.zhutit{
				color: #000;
			}
		}
		.yanlogin{
			display: flex;
			flex-direction: row;
			align-items: center;

		}
		.yandeng{
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			// margin: 100rpx 10rpx 30rpx;
			margin-top: auto;
			.fangshi{
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #999999;
			}
			.icon_wx{
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
				margin: 30rpx auto 40rpx;
			}
			.yinview{
				display: flex;
				flex-direction: row;
				align-items: flex-start;
				margin: 0 auto;
				.yueicon{
					margin-right: 14rpx;
					width: 36rpx;
					height: 36rpx;
				}
				.yuedu{
					font-family: PingFang SC;
					font-weight: 500;
					font-size: 26rpx;
					color: #999999;
					width: 80%;
					text-align: center;

				}
			}

		}
		// padding-bottom: 150rpx;
	}
</style>
